<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>emplist</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../static/css/style.css"/>
    <script src="../static/js/jquery-1.8.3.js"></script>

    <script type="text/javascript">

        /**********加载emplist************/
        $(function () {
            $.ajax({
                    type: "get",
                    url: "/doempList",
                    error: function (result) {
                        alert("当前服务器异常");
                    },
                    data: "",
                    success: function (result) {
                        console.log(result)
                        let tr = '';
                        for (let emp of result) {
                            let id = emp.id
                            let name = emp.name
                            let salary = emp.salary
                            let age = emp.age
                            tr += "<tr align='center' class='row1' ><td>" + id +
                                "</td><td>" + name +
                                "</td><td>" + salary +
                                "</td><td>" + age +
                                "</td><td><a href='empDele?ID=" + id + "'>" + 'delete' + '&nbsp' +
                                "</a><a  >" + 'updata' +
                                "</a><a  class='hidden' >"+id+"</a>" +
                                "</td></tr>"

                        }
                        $("#tbody").append(tr);
                    }
                }
            )
            /*********************************/





            /*********************************/
            $()
            /*$.get("/userAjax3", function (data) {
                let tr = '';
                //遍历返回值结果
                for (let user of data) {
                    let id = user.id
                    let name = user.name
                    let age = user.age
                    let sex = user.sex
                    tr += "<tr align='center'><td>" + id + "</td><td>" + name + "</td><td>" + age + "</td><td>" + sex + "</td></tr>"
                }
                //将tr标签追加到表格中
                //2.利用$.ajax方式获取数据列表
                $("#tab1").append(tr)
            });*/

        })


        /*************************************/

    </script>
</head>
<body>
<!--隐藏取值-->
<input type="text" class="hidden" name="ID"/>
<div id="wrap">
    <div id="top_content">
        <div id="header">
            <div id="rightheader">
                <p>
                    2009/11/20
                    <br/>
                </p>
            </div>
            <div id="topheader">
                <h1 id="title">
                    <a href="#">main</a>
                </h1>
            </div>
            <div id="navigation">
            </div>
        </div>
        <div id="content">
            <p id="whereami">
            </p>
            <h1>
                Welcome!
            </h1>
            <table class="table">
                <tr class="table_header">
                    <td>
                        ID
                    </td>
                    <td>
                        Name
                    </td>
                    <td>
                        Salary
                    </td>
                    <td>
                        Age
                    </td>
                    <td>
                        Operation
                    </td>
                </tr>
                <tbody id="tbody">

                </tbody>

            </table>
            <p>
                <input type="button" class="button" value="Add Employee" onclick="doadd()"/>
                <input type="button" class="button" value="Download" onclick="location='/empDownload'"/>
            </p>
        </div>
    </div>
    <div id="footer">
        <div id="footer_bg">
            ABC@126.com
        </div>
    </div>
</div>
<script type="">
    function doadd(){
        // $("#content").remove();
        $("#content").load("/addEmp")
        alert("1")
    }
</script>
</body>
</html>
